import React, { Component } from 'react'

export default class Parent1 extends Component {
  state={
    num:0
  }
  render() {
    return (
      <div style={{
        width:'280px',
        height:'200px',
        background:'springgreen',
        display:'flex',
        justifyContent:'space-between',
        alignItems:'center',
        padding:'10px'
      }}>
        <button onClick={()=>this.setState({num:this.state.num+1})}>更新</button>
        <Child1></Child1>
        <Child2></Child2>
      </div>
    )
  }
}
class Child1 extends Component{
    render(){
        console.log('-----Parent1的Child1的render-----------');
        return(<div style={{
            width:'130px',
            height:'150px',
            background:'red',
            display:'flex',
            justifyContent:'center',
            alignItems:'center',
          }}>Child1</div>)
    }
}
class Child2 extends Component{
    render(){
        console.log('-----Parent1的Child2的render-----------');
        return(<div style={{
            width:'130px',
            height:'150px',
            background:'orange',
            display:'flex',
            justifyContent:'center',
            alignItems:'center',
          }}>Child2</div>)
    }
}
